<template>
  <j-modal :title="title" :width="800" :visible="visible" :maskClosable="false" :fullscreen="true" @close="close">
    <template slot="footer">
      <a-button key="back" style="padding-left: 8px; padding-right: 8px" @click="close(false)"> 关闭 </a-button>
      <a-button
        :disabled="status === '9'"
        v-if="current == '4'"
        type="danger"
        key="save"
        style="padding-left: 8px; padding-right: 8px"
        @click="setReason()"
      >
        撤销到整改阶段
      </a-button>
    </template>
    <div style="margin: 0 auto" :class="{ isCheck: isCheck }">
        <!-- <a-steps :current="current" @change="onChange">
          <a-step :disabled="getDisabled(1)" :description="getStatus(1)" title="准备阶段" />
          <a-step :disabled="getDisabled(2)" :description="getStatus(2)" title="实施阶段" />
          <a-step :disabled="getDisabled(3)" :description="getStatus(3)" title="报告阶段" />
          <a-step :disabled="getDisabled(4)" :description="getStatus(4)" title="整改阶段" />
          <a-step :disabled="getDisabled(5)" :description="getStatus(5)" title="归档阶段" />
        </a-steps> -->
        <!-- 代替a-steps -->
        <sjSteps @change="onChange">
          <sjStepsItem title="准备阶段" :disabled="getDisabled(1)" :active="current==0" :index="0" :sub_title="getStatus(1)" bgimage="mid_row" icon_img="icon1"/>
          <sjStepsItem title="实施阶段" :disabled="getDisabled(2)" :active="current==1" :index="1" :sub_title="getStatus(2)" bgimage="mid_row" icon_img="icon2"/>
          <sjStepsItem title="报告阶段" :disabled="getDisabled(3)" :active="current==2" :index="2" :sub_title="getStatus(3)" bgimage="mid_row" icon_img="icon3"/>
          <sjStepsItem title="归档阶段" :disabled="getDisabled(4)" :active="current==3" :index="3" :sub_title="getStatus(4)" bgimage="mid_row" icon_img="icon5" :img_size="false"/>
          <sjStepsItem title="整改阶段" :disabled="getDisabled(5)" :active="current==4" :index="4" :sub_title="getStatus(5)" bgimage="mid_row" icon_img="icon4"/>
        </sjSteps>
        <div class="detail">
          <div class="name">
            {{ model.name }}<span>{{ model.stageText }}</span>
          </div>
          <div class="list">
            <div>
              项目编号：<span>{{ model.number }}</span>
            </div>
            <div>
              项目类别：<span>{{ model.type_dictText }}</span>
            </div>
            <div>
              主审计单位：<span>{{ model.sjdw }}</span>
            </div>
            <div>
              被审计单位：<span>{{ model.bsjdwName }}</span>
            </div>
            <div>
              审计期间：<span>{{ model.startDate }} ~ {{ model.endDate }}</span>
            </div>
          </div>
        </div>

        <component :is="active" :model="model"> </component>
    </div>
    <SelectApprove ref="approver" :id="model.id" @submitData="handleSubmit"></SelectApprove>
    <SetReason ref="setReason" @approveReason="approveData"></SetReason>
    <SetReason ref="chSetReason" @approveReason="returnPro"></SetReason>
  </j-modal>
</template>
<script>
import { WORK_AUTH } from '@/store/mutation-types'
import { getAction } from '@/api/manage'
import viewTypeId from '../commView/public/typeId'
import SetReason from '../commView/public/SetReason'
import SelectApprove from '../commView/public/SelectApprover'
import { butStatus } from '../butStatus'
import zbContentView from './zbContentView'
import ssContentView from './ssContentView'
import bgContentView from './bgContentView'
import zgContentView from './zgContentView'
import gdContentView from './gdContentView'
import sjSteps from '@/views/sj/components/sjSteps/sjSteps'
import sjStepsItem from '@/views/sj/components/sjSteps/sjStepsItem'
export default {
  name: 'contentView',
  components: {
    SetReason,
    SelectApprove,
    zbContentView,
    ssContentView,
    bgContentView,
    zgContentView,
    gdContentView,
    sjSteps,
    sjStepsItem,
  },
  mixins: [butStatus],
  data() {
    return {
      current: 4,
      active: 'gdContentView',
      viewTypeId: viewTypeId,
      typeId: viewTypeId['审计归档'],
      activeList: {
        0: 'zbContentView',
        1: 'ssContentView',
        2: 'bgContentView',
        3: 'gdContentView',
        4: 'zgContentView',
      },
      stageMap:{
        '01':'1',
        '02':'2',
        '03':'3',
        '04':'5',
        '05':'4'
      },
      disableSubmit: false,
      title: '',
      visible: false,
      isCheck: false,
      url: {
        returnPro: '/sjxmzygl/sjWorkUsers/recallLastStage',
        permission: '/sys/permission/getButtonByUser',
        submit: '/sjxmzygl/sjWorkUsers/submitAudit',
        approve: '/sjxmzygl/sjWorkUsers/zyApplyCommit',
        butStatus: '/sjxmzygl/sjWorkUsers/queryStageInfo',
      },
      model: {},
      isShow: false,
    }
  },
  methods: {
    getDisabled(num) {
      if (this.model.stage) {
        let a = Number(this.stageMap[this.model.stage.substring(0, 2)])
        if (num <= a) {
          return false
        } else {
          return true
        }
      }
    },
    getStatus(num) {
      if (this.model.stage) {
        let a = Number(this.stageMap[this.model.stage.substring(0, 2)])
        if (num < a) {
          return '已完成'
        } else if (num === a) {
          return this.model.stageText
        } else {
          return '未执行'
        }
      }
    },
    onChange(current) {
      this.current = 0
      this.current = current
      this.active = this.activeList[current]
    },
    getWorkAuth() {
      this.isShow = false
      getAction(this.url.permission, { proId: this.model.id }).then((res) => {
        if (res.success) {
          this.isShow = true
          let workAuthData = res.result.workButtonAuth
          sessionStorage.setItem(WORK_AUTH, JSON.stringify(workAuthData))
        }
      })
    },
    edit(record) {
      this.model = Object.assign({}, record)
      console.log(this.model, '123')
      this.getWorkAuth()
      this.getStstus()
      let current = Number(this.stageMap[this.model.stage.substring(0, 2)])
      this.current = current - 1
      this.active = this.activeList[this.current]
      this.visible = true
    },
    close() {
      this.visible = false
    },
    setReason() {
      this.$refs.chSetReason.setApproveReason = true
    },
    //撤回
    returnPro(reason) {
      getAction(this.url.returnPro, {
        proId: this.model.id,
        typeId: this.typeId,
        stage: '04010',
        remark: reason,
      }).then((res) => {
        if (res.success) {
          this.$message.success(res.message)
          this.$refs.chSetReason.setApproveReason = false
          this.$emit('ok')
          this.close()
        } else {
          this.$message.error(res.message)
        }
      })
    },
  },
}
</script>

<style lang='less' scoped>

@import '../../css/checkAndEdit.less';
.card {
  border: 0;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
</style>
